<template>
	<div class="boxmain">
		<h3>考试信息</h3>
		<ul class="xuekeclass">
			<li :class="xkindex==-1?'hover':''" @click="xkclick('-1')">考试</li>
			<li v-for="(item,index) in xuekelist"  :class="xkindex==index?'hover':''" @click="xkclick(index,item.id,item.fullmark,item.name)">{{item.name}}</li>
		</ul>
		<h3>{{titlecontent.area}}</h3>
		<ul class="examforminfo" v-if="xkindex==='-1'">
			<li>
				<span>考试分类</span>
				<el-select v-model="examinfo.type3" placeholder="请选择">
				  <el-option
				    v-for="item in examclassify"
				    :key="item.id"
				    :label="item.name"
				    :value="item.id">
				  </el-option>
				</el-select>
			</li>
			<li>
				<span>赋分模型</span>
				<el-select v-model="examinfo.modelffType" placeholder="请选择">
				  <el-option
				    v-for="item in fufenmx"
				    :key="item.id"
				    :label="item.name"
				    :value="item.id">
				  </el-option>
				</el-select>
			</li>
			<li>
				<span>A线名称</span>
				<el-select v-model="examinfo.aline" placeholder="请选择" @change="blineClick">
				  <el-option
				    v-for="item in abline"
				    :key="item.id"
				    :label="item.name"
				    :value="item.id">
				  </el-option>
				</el-select>
			</li>
			<li>
				<span>B线名称</span>
				<el-select v-model="examinfo.bline" placeholder="请选择" @change="alineClick">
				  <el-option
				    v-for="item in newbline"
				    :key="item.id"
				    :label="item.name"
				    :value="item.id">
				  </el-option>
				</el-select>
			</li>
			<li>
				<span>查询留痕开关</span>
				<el-switch
				  v-model="areaswith">
				</el-switch>
			</li>
			<li style="color:red;" v-if="attentionIshow">
				<span></span>
				<i class="el-icon-warning-outline"></i>{{attention}}
			</li>
		</ul>
		<ul class="examforminfo" v-else>
			<li>
				<span>学科名称</span>
				<el-input v-model="examinfo.name" clearable placeholder="请输入内容"></el-input>
			</li>
			<li>
				<span>学科满分</span>
				<el-input v-model="examinfo.fullMark" clearable placeholder="请输入内容"></el-input>
			</li>
			<li style="color:red;" v-if="attentionIshow">
				<span></span>
				<i class="el-icon-warning-outline"></i>{{attention}}
			</li>
		</ul>
		<div class="groupbutton">
			<el-button type="primary" @click="baocunbox">保存</el-button>
			<el-button type="primary" @click="scexam" v-if="xkindex!=-1" style="background:red;border:none;">删除</el-button>
		</div>
	</div>
</template>

<script>
	import {navgetgrade,areaxkModify,examDelete,examinfobackadd,deleteStudent} from '../../../api/scoreapi'
	export default{
		data(){
			return{
				examinfo:{
					type3:'',
					modelffType:'',
					aline:null,
					bline:null,
					markThePaperType2:'',
					name:undefined,
					fullMark:undefined
				},
				areaswith:false,
				xuekeinfo:{
					xkname:'',
					fullscore:''
				},
				examclassify:[
					{name:'老高考',id:0},
					{name:'新高考3+3',id:1},
					{name:'新高考3+1+2',id:2},
					{name:'不区分',id:3}
				],
				fufenmx:[
					{name:'全国3+1+2',id:1},
					{name:'广东3+1+2',id:2},
					{name:'山东3+3',id:3},
				],
				abline:[
					{name:'清北线',id:0},
					{name:'强基线',id:1},
					{name:'600分线',id:2},
					{name:'985线',id:3},
					{name:'211线',id:4},
					{name:'特控线（一本线）',id:5},
					{name:'一本线',id:6},
					{name:'二本线',id:7},
					{name:'本科线',id:8},
					{name:'专科线',id:9}
				],
				xkindex:'-1',
				titlecontent:{},
				xuekelist:[],
				newbline:[],
				attentionIshow:false
			}
		},
		mounted() {
			let newtitle = decodeURIComponent(this.$route.query.con)
			this.titlecontent = JSON.parse(newtitle)
			this.xuekeclick(JSON.parse(newtitle).n5Id)
			this.examinfobakcinfo()
			localStorage.setItem('menuState', 2);
			// if(JSON.parse(this.$route.query.con).aline){
			// 	this.newbline = this.abline.filter(item => item.id > JSON.parse(this.$route.query.con).aline)
			// }
			// this.examinfo.type3 = JSON.parse(this.$route.query.con).type3
			// this.examinfo.modelffType=JSON.parse(this.$route.query.con).modelffType
			// this.examinfo.aline=Number(JSON.parse(this.$route.query.con).aline)
			// this.examinfo.bline=Number(JSON.parse(this.$route.query.con).bline)
			// this.areaswith=JSON.parse(this.$route.query.con).markthepapertype2===0?false:true
		},
		methods:{
			examinfobakcinfo(){
				let params={
					navId:this.titlecontent.n5Id
				}
				examinfobackadd(params).then(res=>{
					if(res.data.aline){
						this.newbline = this.abline.filter(item => item.id > res.data.aline)
					}
					this.examinfo.type3 = res.data.type3
					this.examinfo.modelffType=res.data.modelfftype
					this.examinfo.aline=Number(res.data.aline)
					this.examinfo.bline=Number(res.data.bline)
					this.areaswith=res.data.markthepapertype2==0?false:true
				})
			},
			xkclick(num,id,fullMark,name){
				this.xkindex = num
				this.examinfo.navId=id
				this.examinfo.name = name
				this.examinfo.fullMark=fullMark
			},
			//获取学科列表
			xuekeclick(areaid){
				let params={
					ntype:6,
					id:areaid
				}
				navgetgrade(params).then(res=>{
					if(res.code==0){
						this.xuekelist = res.data
					}else{
						this.$message({
							type: 'error',
							message: res.msg
						}); 
					}
				})
			},
			// b线判断
			blineClick(val){
				this.newbline=[]
				this.examinfo.bline = ''
				this.newbline = this.abline.filter(item => item.id > val)
				this.attentionIshow = false
			},
			alineClick(){
				if(!this.examinfo.aline&&this.examinfo.aline>0){
					this.attentionIshow = true
					this.attention = '请选择A线'
				}
			},
			//保存
			baocunbox(){
				// if(this.xkindex=='-1'){
					if(this.examinfo.type3==''&&this.examinfo.type3<0){
						this.attentionIshow = true;
						this.attention = '请选择考试分类';
						return false;
					}else if(this.examinfo.modelffType==''){
						this.attentionIshow = true;
						this.attention = '请选择赋分模型';
						return false;
					}else if(this.examinfo.aline==''&&this.examinfo.aline>0){
						this.attentionIshow = true;
						this.attention = '请选择A线名称';
						return false;
					}else if(this.examinfo.bline==''){
						this.attentionIshow = true;
						this.attention = '请选择B线名称';
						return false;
					}
					if(this.xkindex!=-1){
						const isValidInteger = /-?\d+$/.test(this.addinfo.fullMark);
						if (!isValidInteger) {
							this.attentionIshow = true
							this.attention='请填写整数'
							return false
						  }
					}
				this.examinfo.markThePaperType2 = this.areaswith?1:0
				this.examinfo.navId = this.examinfo.navId?this.examinfo.navId:this.titlecontent.n5Id //n5id地区卷id
				areaxkModify(this.examinfo).then(res=>{
					if(this.xkindex==-1){
						this.examinfobakcinfo()
					}else{
						this.xuekeclick(JSON.parse(this.$route.query.con).n5Id)
					}
					this.$message({
					  message: '添加/编辑考试成功',
					  type: 'success'
					});
				// 	this.areaswith = false
				// 	this.examinfo={
				// 		type3:'',
				// 		modelffType:'',
				// 		aline:'',
				// 		bline:'',
				// 		markThePaperType2:'',
				// 		name:undefined,
				// 		fullMark:undefined,
				// 	}
				})
			},
			//删除
			scexam(){
				let params={
					id:this.examinfo.navId
				}
				this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
				  confirmButtonText: '确定',
				  cancelButtonText: '取消',
				  type: 'warning'
				}).then(() => {
					deleteStudent(params).then(res=>{
						if(res.code==0){
							
							this.$message({
								type: 'success',
								message: res.msg
							});
							this.examinfobakcinfo()
						}else{
							this.$message({
								type: 'error',
								message: res.msg
							});
						}
					})
				}).catch(() => {
				  this.$message({
					type: 'info',
					message: '已取消删除'
				  });          
				});
				
			}
		}
	}
</script>

<style scoped>
	.boxmain h3{
		padding:20px 0;
		font-size:18px;
	}
	.boxmain{
		padding:30px;
	}
	.examforminfo li{
		display: flex;
		align-items: center;
		padding-bottom:30px;
	}
	.examforminfo li span{
		font-size:16px;
		display: flex;
		align-items: center;
		width:100px;
		justify-content: left;
	}
	.examforminfo li span i{
		font-style:normal;
		color:red;
		padding-left:5px;
	}
	/* .examforminfo li p{
		position: relative;
	}
	.examforminfo li p em{
		position: absolute;
		right:10px;
		top:50%;
		transform: translateY(-50%);
		color:#C0C4CC;
		cursor: pointer;
	} */
	.examforminfo li >>> .el-input{
		width:350px;
	}
	.groupbutton{
		display: flex;
		align-items: center;
		padding-top:60px;
	}
	.groupbutton >>> .el-button{
		background:#165DFF;
		width:100px;
		margin-right:20px;
	}
	.xuekeclass{
		display: flex;
	}
	.xuekeclass li{
		width: 60px;
		height: 30px;
		border-radius: 32px;
		cursor: pointer;
		text-align: center;
		line-height:30px;
	}
	.xuekeclass li.hover,.xuekeclass li:hover{
		background:#F2F3F8;
		color:#165DFF;
	}
</style>